<template>
    <div class="mg-content">
        <div class="table-search text-left" >
            <el-row :gutter="20">
                <el-col :span="6">
                    <el-input v-model="input" @keyup.enter.native="keyDown($event)" placeholder="请输入单位名称" :maxlength="20" size="medium"></el-input>
                </el-col>
                <el-col :span="10">
                    <el-button  class="btn-info" icon="el-icon-search" @click="search" size="medium">搜索</el-button>
                    <el-button  class="btn-warning" style="margin-left: 1px"   icon="el-icon-refresh" @click="cleanSearch" size="medium">重置</el-button>
                </el-col>
            </el-row>
        </div>
        <div class="table-padding">
            <div class="title-buttons">
                <el-button v-hasPermission="'management_dishes:edit'" class="title-button btn-primary" @click="addShow=true;activityId=''"  icon="el-icon-plus" size="medium">添加&nbsp;</el-button>
            </div>
            <el-table
                    v-loading="loading"
                    :data="tableData"
                     :border="true"
                     style="width: 100%">
                <el-table-column
                        type="index"
                        width="50">
                </el-table-column>
                <!--<el-table-column-->
                        <!--label="单位编码">-->
                    <!--<template slot-scope="scope">-->
                        <!--<span>{{scope.row.no}}</span>-->
                    <!--</template>-->
                <!--</el-table-column>-->
                <el-table-column
                        label="单位名称">
                    <template slot-scope="scope">
                        <span>{{scope.row.name}}</span>
                    </template>
                </el-table-column>
                <!-- <el-table-column
                        label="状态">
                    <template scope="scope">
                        <span>{{scope.row.state.text}}</span>
                    </template>
                </el-table-column> -->
             <!-- <el-table-column
                label="修改" width="100">
                <template  slot-scope="scope">
                  <span v-hasPermission="'management_dishes:edit'" class="icon icon-xiugai-copy table-icon" @click="addShow=true;activityId=scope.row.id"></span>
                </template>
              </el-table-column>
              <el-table-column
                label="删除" width="100">
                <template  slot-scope="scope">
                  <span v-hasPermission="'management_dishes:edit'" class="icon icon-delete table-icon" @click="handleDelete(scope.$index,scope.$index,scope.row.id)"></span>
                </template>
              </el-table-column>-->
              <el-table-column
                label="操作" width="240">
                <template slot-scope="scope" >
                  <el-button v-hasPermission="'management_dishes:edit'" type="text" size="small" style="margin: 0px;" @click="addShow=true;activityId=scope.row.id" >修改 |</el-button>
                  <el-button v-hasPermission="'management_dishes:edit'" type="text" size="small" style="margin: 0px;" @click="handleDelete(scope.$index,scope.$index,scope.row.id)">删除 </el-button>
                </template>
              </el-table-column>
            </el-table>
            <br>
            <div class="block">
                <el-row>
                    <el-col :span="24" class="text-right">
                        <el-pagination
                                @size-change="handleSizeChange"
                                @current-change="handleCurrentChange"
                                :current-page="currentPage"
                                :page-sizes="pageSizes"
                                :page-size="pageSize"
                                layout="total, sizes, prev, pager, next, jumper"
                                :total="total">
                        </el-pagination>
                    </el-col>
                </el-row>
            </div>
        </div>
        <model :isShow="addShow" :id="activityId" v-on:close="addClose" v-on:addSuccess="addSuccess"></model>
      <PluginConfirm
        :show="dialogIsShow"
        @chooseSure="chooseSure()"
        @chooseCancel="chooseCancel()"
        @dialogResult="dialogResult">
      </PluginConfirm>
    </div>
</template>
<script>
    //注意路径
    import model from './model.vue'
    export default{
        data(){
            return {
                tableData: [],
                loading:false,
                pageSizes:window.pageSizes,//所有可选择的条数
                pageSize:window.pageSize,//控制一页显示的条数
                currentPage:1,
                input:"",
              inputValue:"",
                total:10,
                addShow:false,
                activityId:"",
                curDataRow:null,
                curDataIndex:0,
              storeId:window.localStorage.getItem("dishKuId"),
              selectItmeIndex:"",
              selectItemDetailsIndex:"",
              selectDelId:"",
              dialogIsShow:false
            }
        },
        created(){
            window.this = this;
            this.initData();
        },
        components: {
            model
        },
        methods: {
            initData(){
                this.loading=false;
              this.getData();
            },
            handleSizeChange(val){
                this.pageSize=val;
                this.search();
            },
            keyDown(ev){

            },
          cleanSearch(){
            this.currentPage=1;
            this.input="";
            this.inputValue=this.input;
            this.getData();
          },
          search(){
            this.currentPage=1;
            this.inputValue=this.input;
            this.getData();
          },
          handleCurrentChange(currentPage){
            this.currentPage=currentPage;
            this.getData();
          },
          getData(){
            this.loading=true;
            this.$axios.get("dishes/dishesUnits?page.pn="+this.currentPage+"&page.size="+this.pageSize+"&search.name_like="+this.inputValue+"&storeId="+this.storeId).then((data)=>{
              this.loading=false
              this.tableData=data.content.content;
              this.total=data.content.totalElements;
            }).catch(function(err){
            })
          },
            goBack() {
                this.router.go(-1);
            },
            handleEdit(index, row) {
                console.log(index, row);
            },
            /*用户选择提示框后处理*/
            dialogResult(param){
                this.dialogIsShow=param.close;
                if(param.choose==="ok"){
                    //console.log("确定");
                    this.$axios.delete("dishes/dishesUnits/"+this.curDataRow.id).then(data=>{
                        if(data.body.status==200){
                            this.tableData.splice(this.curDataIndex,1);
                            this.$message({
                                type: 'success',
                                message: '删除成功!'
                            });
                            this.initData();
                        }else{
                            this.$message({
                                type: 'error',
                                message: data.message
                            });
                        }
                    })
                }else if(param.choose==="cancel"){
                    //console.log("取消");
                }else{
                    //console.log("不做处理");
                }
            },
            handleDelete(index, row) {
                this.curDataIndex = index;
                this.curDataRow = row;
                this.dialogIsShow = true;
                return false;
            },
            addSuccess(item){
                this.addShow=false;
                this.initData();
            },
            addClose(){
                this.addShow=false;
            },
        }
    }
</script>
<style scoped>
</style>
